{extend name="public/world"}
{block name="style"}
<style type="text/css">
    #tbDayList{
        width:100%;
    }
    #tbDayList th{
        font-size:21px;
        border: 1px solid #eee;
        line-height: 30px;
        background-color: #ccc;
    }
    #tbDayList .td-day{
        position: relative;
        text-align: center;
        width:auto;
        height:80px;
        line-height: 30px;
        padding:0;
        border: 1px solid #eee;
        color:#72B9F7;
    }
    #tbDayList .other{
        color:#999;
    }
    #tbDayList .future{
        color:#72B9F7;
    }
    #tbDayList .today{
        color:blue;
        background-color: beige;
    }
    #tbDayList .old{
        background-color:#e0e0e0;
    }
    #tbDayList .xiu{
        background-color:#fff;
    }
    #tbDayList .td-day .ban {
        position: absolute;
        top: 1px;
        right: 5px;
        color: #9a98f3;
    }
    #tbDayList .td-day .xiu {
        position: absolute;
        top: 1px;
        right: 5px;
        color: #000;
    }
    #tbDayList .td-day .old_ban {
        position: absolute;
        top: 1px;
        right: 5px;
        color: #096b09;
    }
    #tbDayList .td-day .old_xiu {
        position: absolute;
        top: 1px;
        right: 5px;
        color: #999;
    }
    #tbDayList .td-day .set-btn {
        position: absolute;
        top: 2px;
        left: 5px;
        color: #9a98f3;
        display: none;
    }
</style>
{/block}
{block name="container"}
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-header">
            <span class="pro-status">{$data.month_cur}</span>
            <div class="layui-btn-group layuiadmin-btn-group">
                <a href="{:url('/projects.WorkDays/index')}?month={$data.month_pre}" class="layui-btn layui-btn-primary layui-btn-xs">上一月</a>
                <a href="{:url('/projects.WorkDays/index')}?month={$data.month_next}" class="layui-btn layui-btn-primary layui-btn-xs">下一月</a>
            </div>
        </div>
        <div class="layui-card-body">
            <table id="tbDayList" class="tb">
                <thead>
                <th>周一</th>
                <th>周二</th>
                <th>周三</th>
                <th>周四</th>
                <th>周五</th>
                <th style="color:blue;">周六</th>
                <th>周日</th>
                </thead>
                <tbody>
                {volist name="data.list" id="week"}
                <tr>
                    {volist name="week" id="wr" }
                    <td class="td-day{$wr.class}" data-dt="{$wr.dt}">
                        {$wr.day}
                        <span class="{$wr.typeclass}">{$wr.type}</span>
                        {notempty name="wr.btn"}
                        <div class="set-btn">
                            {if $wr.btn == 'set_ban'}
                            <a href="{:url('/projects.WorkDays/add')}?day={$wr.dt}&type=1" class="layui-btn layui-btn-xs j-ajax" confirm="您确定要调整{$wr.day}号为上班日吗？">上班</a>
                            {else /}
                            <a href="{:url('/projects.WorkDays/add')}?day={$wr.dt}&type=0" class="layui-btn layui-btn-xs layui-btn-danger j-ajax" confirm="您确定要调整{$wr.day}号为休息日吗？">休息</a>
                            {/if}
                        </div>
                        {/notempty}
                    </td>
                    {/volist}
                </tr>
                {/volist}
                </tbody>
            </table>
        </div>
    </div>
</div>
{/block}
{block name="script"}
<script>
    layui.use(['form'], function() {
        var $ = layui.jquery;

        $('.td-day').on('mouseover', function() {
            $(this).find('.set-btn').show();
        }).on('mouseout', function() {
            $(this).find('.set-btn').hide();
        });
    });
</script>
{/block}